﻿@page
@using Volo.Abp.AspNetCore.Mvc.UI.Layout
@model YaAppoint.Web.Pages.CustomSettings.IndexModel
@inject IPageLayout PageLayout
@{
    PageLayout.Content.Title = "自定义设置";
}
@section scripts
{
    <abp-script src="/Pages/CustomSettings/Index.cshtml.js"></abp-script>
}
@section styles
{
    <abp-style src="/Pages/CustomSettings/Index.css"></abp-style>
}
<div class="content-container">
    <div id="app">
        <div class="title-container">
            <div>
                 <span v-if="level===0">{{hospital}}    (全局)</span>
                <span v-else-if="level===1">{{department?department.name:''}}  (科室)</span>
                <span v-else-if="level===2">{{department?department.name:''}}-{{deviceType?deviceType.name:''}} (科室设备类型)</span>
                <span v-else>{{department?department.name:''}}-{{deviceType?deviceType.name:''}}-{{device?device.name:''}}  (设备)</span> 
            </div>
        </div>
        <hr class="line-gray" />
        <div class="container-body">
            <div class="nav-container">
                <el-tree :data="treeData" :props="defaultProps" :expand-on-click-node="false" default-expand-all :highlight-current="true" v-on:node-click="nodeClicked" node-key="id">
                    <span class="custom-tree-node" slot-scope="{ node, data }">
                        <i :class="data.icon"></i>
                        <a>
                            <cite>{{node.label }}</cite>
                        </a>
                    </span>
                </el-tree>
            </div>
            <div class="table-container">
                <el-row>
                    <el-col :span="24" style="position:relative;" >
                        <div class="grid-content bg-purple-dark" style="position:absolute;right:10px;">
                            <el-button type="primary" v-on:click="setEditable" icon="el-icon-edit" v-if="globalEditPermission|| level!==0" size="mini" style="margin-left:10px;">编辑</el-button>
                            <el-button v-on:click="save" icon="fa fa-floppy-disk" size="mini" v-if="settingDisbablePermission && !formDisabled ">保存</el-button>
                        </div>
                    </el-col>
                </el-row>
                <hr class="line-gray" style="margin-top:40px !important" />
                <el-form :model="setting" :label-width="formLabelWidth" ref="settingForm" :rules="rules" :disabled="formDisabled">
                    <el-row>
                        <el-col :span="24">
                            <div class="grid-content bg-purple-dark">
                                <el-form-item label="可预约天数" prop="appointableCount">
                                    <el-input v-model.number="setting.appointableCount" type="number" size="mini" autocomplete="off" clearable ></el-input>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                    <el-row v-if="setting.level ===0">
                        <el-col :span="24">
                            <div class="grid-content bg-purple-dark">
                                <el-form-item label="自动天数" prop="autoAppointableCount">
                                    <el-input v-model.number="setting.autoAppointableCount" type="number" size="mini" autocomplete="off" clearable></el-input>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <div class="grid-content bg-purple-dark">
                                <el-form-item label="最迟提前预约(分钟)" prop="latestAppoint">
                                    <el-input v-model.number="setting.latestAppoint" type="number" size="mini" autocomplete="off" clearable></el-input>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <div class="grid-content bg-purple-dark">
                                <el-form-item label="可提前签到时间(分钟)" prop="earliest">
                                    <el-input v-model.number="setting.earliest" type="number" size="mini" autocomplete="off" clearable></el-input>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                    <el-row v-if="setting.level ===0">
                        <el-col :span="24">
                            <div class="grid-content bg-purple-dark">
                                <el-form-item label="号段长度" >
                                    <el-select size="mini" style="width:100%;" v-model.number="setting.hisIntervalSpan"  placeholder="请选择">
                                        <el-option v-for="item in intervalSpanOptions"
                                                   :key="item.value"
                                                   :label="item.label"
                                                   :value="item.value">
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <div class="grid-content bg-purple-dark">
                                <el-form-item label="到诊模式"  prop="checkInMode">
                                    <el-select size="mini" style="width:100%;" v-model.number="setting.checkInMode"  placeholder="请选择" clearable>
                                        <el-option v-for="item in checkInModeOptions"
                                                   :key="item.value"
                                                   :label="item.label"
                                                   :value="item.value" >
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <div class="grid-content bg-purple-dark">
                                <el-form-item label="自动取消未支付预约" >
                                    <el-select size="mini" style="width:100%;" v-on:change="unpaidWillBeCancelChange" v-model="setting.unpaidWillBeCancel" placeholder="请选择" clearable >
                                        <el-option v-for="item in autoCancelOptions"
                                                   :key="item.value"
                                                   :label="item.label"
                                                   :value="item.value">
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                    <el-row v-if="setting.unpaidWillBeCancel===true">
                        <el-col :span="24">
                            <div class="grid-content bg-purple-dark">
                                <el-form-item label="自动取消时间(小时)"  prop="unpaidTimeLimit">
                                    <el-input v-model.number="setting.unpaidTimeLimit" type="number" size="mini" autocomplete="off" clearable></el-input>
                                </el-form-item>
                            </div>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
        </div>
    </div>
</div>